<script>
export default {
  name: "imageAvater",
  props: {
    /**
     * @destroyed src 图片地址
     */
    src: {
      type: String,
      default: ''
    },
    /**
     * @destroyed width 图片宽度 单位rpx
     */
    width: {
      type: Number,
      default: 200
    },
    /**
     * @destroyed width 图片高度 单位rpx
     */
    height: {
      type: Number,
      default: 200
    },
    /**
     * @destroyed mode 图片裁剪模式
     */
    mode: {
      type: String,
      default: 'widthFix'
    },
    isOrder: {
      type: Boolean,
      default: false
    },
    borderWidth:{
      type: Number,
      default: 2
    },
    borderColor: {
      type: String,
      default: '#FF4206'
    },
    margin:{
      type:String,
      default:''
    }
  }
}
</script>

<template>
  <view class="imageAvater" :style="{
  width:`${width}rpx`,
  height:`${height}rpx`,
  border:!!isOrder? `${borderWidth}rpx solid ${borderColor}` : 'none',
  margin:margin
}">
    <image :src="src" :style="{
    width:'100%'
  }" :mode="mode"></image>
  </view>
</template>

<style scoped lang="scss">
.imageAvater {
  border-radius: 50%;
  overflow: hidden;
}
</style>